<template name="steedosLookups">
	<div class="slds-form-element steedos-lookups" {{readonlyStr}}>
		<div class="slds-form-element__control">
			{{#if isDisabled}}
				<div class="outputLookupContainer forceOutputLookupWithPreview">
					{{#each _readonlyValues}}
						<a class="{{#if hasLink}}textUnderline outputLookupLink {{/if}}slds-truncate forceOutputLookup"
						   data-refid="recordId"
						   data-recordid="{{value}}" data-special-link="true" rel="noreferrer" title="{{label}}"
						   data-aura-class="forceOutputLookup" href="{{outPutLookupHref value}}">{{label}}</a>{{#unless
							(isLast @index)}},{{/unless}}
					{{/each}}
				</div>
			{{else}}
				<div class="slds-combobox_container {{#if
						isReadOnly}}slds-has-inline-listbox{{else}}slds-has-object-switcher{{/if}}">
					{{!----}}
					{{#if showObjectSwitche}}
						<div class="slds-listbox_object-switcher slds-dropdown-trigger slds-dropdown-trigger_click steedos-lookups-object-switche">
							<a class="slds-button slds-button_icon" aria-haspopup="true"
							   title="Select object to search in" href="javascript:void(0);" data-toggle="dropdown">
								{{#with getSelectedReference}}
									{{> steedos_icon class="slds-icon slds-icon_small" source="standard-sprite" name=(getIcon icon) title=object}}
								{{/with}}
								{{> steedos_icon class="slds-icon slds-icon_xx-small" source="utility-sprite" name="down"}}
							</a>

							<div class="dropdown-menu dropdown-menu-left dropdown-references" role="menu">
								<ul class="slds-dropdown__list slds-show">
									{{#each getReferences}}
										<li class="slds-dropdown__item references-item" role="presentation">
											<a role="option" tabindex="-1" class="item-edit-action"
												data-id="{{object}}">
												{{> steedos_icon class="slds-icon slds-icon_small" source="standard-sprite" name=(getIcon icon)}}
												<span class="reference-name" title="{{#if label}}{{label}}{{else}}{{_
													object}}{{/if}}">{{#if label}}{{label}}{{else}}{{_
														object}}{{/if}}</span>
											</a>
										</li>
									{{/each}}
								</ul>
							</div>

						</div>
					{{/if}}
					<div class="slds-combobox slds-dropdown-trigger slds-dropdown-trigger_click {{#if
							open}}slds-is-open{{/if}}" aria-expanded="false"
						 aria-haspopup="listbox" role="combobox">
						<select name={{name}} multiple={{multiple}} id={{id}} data-schema-key={{dataSchemaKeyFromAtts}}
								data-reference="{{selectedReferenceObject}}" data-init="{{lookupInit}}"
								data-old-value="{{value}}">
							<option value=""></option>
							{{#each getItems}}
								<option value={{value}} selected={{selected}} title="{{label}}">{{label}}</option>
							{{/each}}
						</select>

						<div class="slds-combobox__form-element slds-input-has-icon{{#if
								isReadOnly}} slds-input-has-icon_left-right{{else}} slds-input-has-icon_right{{/if}} "
							 role="none">
							{{#if isShowIcon}}
							{{#if isReadOnly}}
								{{> steedos_icon class="slds-icon slds-icon_smal" wrapClassName="slds-combobox__input-entity-icon" source="standard-sprite" name=(getIcon selectedReferenceIcon)}}
							{{/if}}
							{{/if}}
							{{#with _value}}
								<input type="text"
									   class="form-control slds-input slds-combobox__input steedos-lookups-input {{#if
											   isReadOnly}}{{#if isShowIcon}}has-value{{/if}}{{/if}}"
									   id="for-{{id}}"
									   aria-autocomplete="list"
									   aria-controls="listbox-unique-id"
									   autocomplete="off"
									   role="textbox"
									   placeholder="{{_ "Search"}} {{placeholder}}..."
									   aria-activedescendant="{{value}}" readonly="{{isReadOnly}}" {{readonlyStr}} value="{{label}}">
								{{#unless fieldReadonly}}
									{{#if isReadOnly}}
										<a class="slds-button slds-button_icon slds-input__icon slds-input__icon_right slds-pill__remove">
											{{> steedos_icon class="slds-button__icon" source="utility-sprite" name="close"}}
										</a>
									{{else}}
										{{> steedos_icon class="slds-icon slds-icon slds-icon_x-small slds-icon-text-default" wrapClassName="slds-input__icon slds-input__icon_right" source="utility-sprite" name="search"}}
									{{/if}}
								{{/unless}}
							{{/with}}
						</div>

						{{!--选择项--}}
						<div id="listbox-unique-id" role="listbox">
							<ul class="slds-listbox slds-listbox_vertical slds-dropdown slds-dropdown_fluid"
								role="presentation">
								{{#if isOpened}}
									{{#each getItemsUnselected}}
										<li role="presentation" data-value={{value}} data-index={{@index}} data-selectable
											class="listbox__item {{isPlaceholder}}">
											<span id="{{value}}"
												  class="slds-media slds-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta {{#if activeOption @index}}slds-has-focus{{/if}}"
												  role="option">
												{{!----}}
												{{#if isShowIcon}}
													<span class="slds-media__figure">
													{{> steedos_icon class="slds-icon slds-icon_small" source="standard-sprite" name=(getIcon selectedReferenceIcon)}}
												</span>
												{{/if}}

												<span class="slds-m-left--smalllabels slds-truncate slds-media__body media__body-center">
													<span class="slds-listbox__option-text slds-listbox__option-text_entity" title="{{label}}">{{label}}</span>
												</span>
											</span>
										</li>
									{{/each}}
									{{#if canCreate}}
									<li role="presentation">
										<span class="createNew slds-media items-center slds-listbox__option slds-listbox__option_entity slds-listbox__option_has-meta {{#if activeOption 'create'}}slds-has-focus{{/if}}"
											  role="option">
											<span class="mr-3 ml-1">
												{{> steedos_icon class="slds-icon slds-icon_x-small" source="utility-sprite" name="add"}}
											</span>

											<span class="slds-m-left--smalllabels slds-truncate slds-media__body media__body-center mt-0">
												<span class="slds-listbox__option-text slds-listbox__option-text_entity">{{_ 'New'}} {{createTitle}}</span>
											</span>
										</span>
									</li>
									{{/if}}
								{{/if}}
							</ul>
						</div>
					</div>
				</div>
				{{#if isMultiple}}
				{{!--已选中的(多选)--}}
					<div id="listbox-selections-unique-id" role="listbox" aria-orientation="horizontal" {{readonlyStr}}>
						<ul class="slds-listbox slds-listbox_inline slds-p-top_xxx-small slds-selected-items-{{id}}"
							role="group"
							aria-label="Selected Options:">
							{{#each getItemsSelected}}
								<li role="presentation" class="slds-listbox__item" data-value={{value}}>
									<span class="slds-pill" role="option" tabindex="0" aria-selected="true">
										{{!----}}
										{{#if isShowIcon}}
											<span class="slds-avatar slds-avatar_x-small slds-pill__icon_container">
											{{> steedos_icon class="slds-icon" source="standard-sprite" name=(getIcon selectedReferenceIcon)}}
										</span>
										{{/if}}
										<span class="slds-pill__label" title="{{label}}">{{label}}</span>
										{{#unless fieldReadonly}}
										<span class="slds-pill__remove" title="{{_ "Delete"}}">
											{{> steedos_icon class="slds-icon slds-icon_x-small slds-icon-text-default" source="utility-sprite" name="close"}}
										</span>
										{{/unless}}
									</span>
								</li>
							{{/each}}
						</ul>
					</div>
				{{/if}}
			{{/if}}
		</div>
	</div>
</template>
